{% extends 'base.html' %}
{% block title %}Brisbane Coupon{% endblock %}
{% block stylesheet %}
{{ block.super }}
<style type="text/css">
.myHeader.ui-li-heading {
    color:#cc0000;
}
.myParagraph.ui-li-desc {
    color:#333;
    overflow:show;
    text-overflow:clip;
    white-space:normal;
    height:28px;
    margin-bottom:0px;
}
</style>
{% endblock%}

{% block javascript %}
{{ block.super }}
<script>
</script>
{% endblock%}

{% load thumbnail %}
{% load brispon_filter %}

{% block content %}
<div>
  <form method="get" action="">
    <input type="search" name="q" id="id_q" />
  </form>
  
  <ul data-role="listview" data-inset="true">
    <li data-role="list-divider">Events</li>
    {% for event in objects_page.object_list %}
    <li>
      <a href="{{ event.murl }}">
      {% thumbnail event.thumbnail "150x150" crop="center" as im %}
	  <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}">
      {% endthumbnail %}
      <h3 class="myHeader">{{ event.name }}</h3>
      <p class="myParagraph">{{ event.representative|striptags }}</p>
      <p class="ui-li-aside">+{{ event.edate|timeuntil|mshortendate }}</p>
      </a>
    </li>
    {% endfor %}
  </ul>
  {% include 'mpaginator.html' %}
</div>
{% endblock %}
